import React from "react";
import Button from "./components/Button";
import Menu from "./components/Menu/menu";
import { library, Library } from "@fortawesome/fontawesome-svg-core";
import { fas } from "@fortawesome/free-solid-svg-icons";
import MenuItem from "./components/Menu/menuItem";
import SubMenu from "./components/Menu/subMenu";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faCoffee } from "@fortawesome/free-solid-svg-icons";
library.add(fas)
function App() {
  return (
    <div className="App">
      <header className="App-header">
        <h1>Hello World</h1>
        {/* 普通按钮 */}
        <Button btnType="primary" size="lg" onClick={() => alert("clicked")}>
          大按钮
        </Button>
        <FontAwesomeIcon icon={faCoffee}></FontAwesomeIcon>
        {/* 禁用按钮 */}
        <Button btnType="danger" disabled>
          禁用按钮
        </Button>

        {/* 链接按钮 */}
        <Button btnType="link" href="https://www.baidu.com" target="_blank">
          跳转链接
        </Button>
        <code>const a = 'b'</code>
        <Menu defaultIndex="0" onSelect={(index)=>{alert(index)}} mode="horizontal" defaultOpenSubMenus={['2']}>
          <MenuItem>cool Link1</MenuItem>
          <MenuItem disabled>cool Link2</MenuItem>
          <SubMenu title="dropdown">
            <MenuItem>dropdown1</MenuItem>
            <MenuItem>dropdown2</MenuItem>
          </SubMenu>
          <MenuItem>cool Link3</MenuItem>
        </Menu>
        <p>
          Edit <code>src/App.tsx</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

export default App;
